<template>
  <ul class="todo-list">
    <!--循环任务-关联选中状态-铺设数据 -->
    <!-- completed: 完成的类名 -->
    <li :class="{completed:item.isDone}" v-for="(item,index) in arr" :key="index">
      <div class="view">
        <input class="toggle" type="checkbox" v-model='item.isDone'/>
        <label>{{item.name}}</label>
        <button class="destroy" @click="delFn(index)"></button>
      </div>
    </li>
  </ul>
  
</template>

<script>
export default {
    props: {
        arr:Array,
    },
    methods: {
        // 子传父  删除任务
        delFn(index) {
            this.$emit('delFun',index)
        }
    }
}
</script>